import React, { Component } from 'react';
import { StyleSheet, Image, TouchableOpacity, Text } from 'react-native';
import { px2dp } from '../../../common/styles';

/**
 * @modifyAuthor kanglang
 * @description 新闻卡片
 * @createDate 2020/8/24
 */

export default class NewCard extends Component {
    constructor(props) {
        super(props);
        this.state = {}
    }
    goArtical = () => {
        const { source } = this.props;
        this.props.click && this.props.click(source);
    }
    render() {
        const { source } = this.props;
        return (
            <TouchableOpacity
                activeOpacity={0.8}
                style={styles.cardBtn}
                onPress={this.goArtical}
            >
                <Image
                    resizeMode='cover'
                    style={styles.cardImg}
                    source={{uri:source.imageId}}>
                </Image>
                <Text numberOfLines={2} style={styles.newsTitle}>{source.contentTitle}</Text>

            </TouchableOpacity>
        );
    }
}
const styles = StyleSheet.create({
    cardBtn: {
        backgroundColor: '#fff',
        width: px2dp(150) * 2,
        borderRadius: px2dp(6) * 2,
        marginRight: px2dp(10) * 2
    },
    cardImg: {
        width: "100%",
        height: px2dp(86) * 2,
        borderTopLeftRadius: px2dp(6) * 2,
        borderTopRightRadius: px2dp(6) * 2
    },
    newsTitle: {
        color: '#343332',
        fontSize: px2dp(14) * 2,
        paddingLeft: px2dp(10) * 2,
        paddingTop: px2dp(15),
        paddingRight: px2dp(10) * 2,
        paddingBottom: px2dp(15)
    }
});
